/*
 * @Description: 
 * @Author: 韩双双
 * @Date: 2021-04-22 15:56:03
 * @LastEditTime: 2021-04-27 14:59:38
 * @LastEditors: 韩双双
 */

import useStore from '@/context/useStore';
import React, { useEffect } from 'react';
import { observer } from 'mobx-react-lite';
import styles from './articles.less';
import { useHistory} from 'umi'
import {
    TagsOutlined
} from '@ant-design/icons'; 

function articlesTag() {
    let { article } = useStore()
    let history = useHistory()
    useEffect(() => {
        article.getArticletag()
    }, [])
    let Tag=(ID:string)=>{
        history.push('/index/tag/git',{ID:ID})
    }
    return (
        <div className={styles.context}>
            <div className={styles.articles}>
                <h3><TagsOutlined />文章标签</h3>
                <div>
                    {
                        article.articleTag.map(item => {
                            return <span key={item.id} onClick={()=>Tag(item.value)}>{item.label+`[${item.articleCount}]`}</span>
                        })
                    }
                </div>
            </div>
            
        </div>
    )
}
export default observer(articlesTag)
